<template>
    <div class="footer">
        <div class="container">
            <div class="links">
                <div class="item">
                    <a target="_blank" href="http://www.gov.cn/" class="ant-dropdown-link">
                        <span>中央人民政府</span><i></i>
                    </a>
                </div>
                <div class="item">
                    <a target="_blank" href="http://www.hebei.gov.cn/" class="ant-dropdown-link">
                        <span>河北省人民政府</span><i></i>
                    </a>
                </div>
                <div class="item">
                    <a target="_blank" href="http://www.sjz.gov.cn/" class="ant-dropdown-link">
                        <span>石家庄市人民政府</span><i></i>
                    </a>
                </div>
                <div class="item">
                    <a target="_blank" href="http://www.sjzlq.gov.cn/" class="ant-dropdown-link">
                        <span>鹿泉区人民政府</span><i></i>
                    </a>
                </div>
            </div>
            <div class="f2">
                <div style="width:512px"><img src="https://zhyq.ailuquan.cn/website/assets/images/luquan/footer-logo.png"></div>
                <div class="ant-col ant-col-14" style="padding-left: 15px; padding-right: 15px;">
                    <div class="footer-write">
                        <p>主办：鹿泉区大数据中心 ,备案号：冀ICP备2021004472号</p>
                        <p>地址：鹿泉区山前大道智慧城市广场</p>
                        <p>邮编：050200，电话：83874917</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup>
import { getCurrentInstance,reactive } from 'vue'
let { proxy } = getCurrentInstance()
const props = defineProps({
})
let obj = reactive({
})
</script>

<style lang="scss" scoped>
    .footer {
        background-color: #1a509a; padding: 15px 0;color: #fff;
        .container { margin: 0 auto; max-width: 1200px; min-width: 1200px; width: 100%; box-sizing: border-box; }
        .links { 
            color: #FFFFFF; display: flex; justify-content: space-between; height:68px;
            .item {
                flex:1; margin:0 7px; font-size:14px;
                a { 
                    background-color: #0a67b1; border: 1px solid #97b0d1; border-radius: 3px; color: #fff; box-sizing: border-box;
                    display: flex; height: 38px; line-height: 38px; padding: 0 0px 0 12px; 
                    span { flex:1 }
                    i { width:38px; text-align: center; }
                    i:before { font-style: normal; content:'\e629'; font-family:iconfont;  }
                }
            }
        }
        .f2 { display: flex; font-size:14px;
            p { line-height: 1.5; margin: 0; }
        }
    }
</style>